<!DOCTYPE html>
<html>
<head></head>
<body>
	
<center>
<h1>Rotating Icon</h1>

<svg class=chrome-icon1 focusable="false" width="200" height="200" data-prefix="fab" data-icon="chrome" fill="#4586F3" class="svg-inline--fa fa-chrome fa-w-16" role="img" xmlns="http://www.w3.org/2000/svg" viewBox="0 0 496 512"><path fill="#4586F3" d="M131.5 217.5L55.1 100.1c47.6-59.2 119-91.8 192-92.1 42.3-.3 85.5 10.5 124.8 33.2 43.4 25.2 76.4 61.4 97.4 103L264 133.4c-58.1-3.4-113.4 29.3-132.5 84.1zm32.9 38.5c0 46.2 37.4 83.6 83.6 83.6s83.6-37.4 83.6-83.6-37.4-83.6-83.6-83.6-83.6 37.3-83.6 83.6zm314.9-89.2L339.6 174c37.9 44.3 38.5 108.2 6.6 157.2L234.1 503.6c46.5 2.5 94.4-7.7 137.8-32.9 107.4-62 150.9-192 107.4-303.9zM133.7 303.6L40.4 120.1C14.9 159.1 0 205.9 0 256c0 124 90.8 226.7 209.5 244.9l63.7-124.8c-57.6 10.8-113.2-20.8-139.5-72.5z"></path></svg>
<br>
<svg  class="chrome-icon2" width=250px height=250px version="1.1" id="Layer_1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" x="0px" y="0px"
	 viewBox="0 0 512 512" style="enable-background:new 0 0 512 512;" xml:space="preserve">
<polygon style="fill:#D32E2A;" points="385.829,128 385.829,256 347.429,291.072 307.2,256 272.457,241.371 306.59,165.51 "/>
<polygon style="fill:#3A5BBC;" points="384,385.219 256,385.219 255.39,383.391 226.133,356.291 255.39,308.041 270.629,271.848 
	355.962,302.043 "/>
<polygon style="fill:#FBBB00;" points="256.61,128.61 288.305,164.901 256.61,203.959 241.371,240.152 161.524,200.253 128,126.781 
	256,126.781 "/>
<polygon style="fill:#28B446;" points="239.543,270.629 204.495,346.843 126.171,384 126.171,256 163.962,232.558 204.8,256 "/>
<polygon style="fill:#518EF8;" points="512,256 384,385.219 270.629,271.848 307.2,256 385.829,256 "/>
<polygon style="fill:#91C646;" points="255.39,383.391 255.39,512 126.171,384 239.543,270.629 255.39,307.2 255.39,308.041 "/>
<polygon style="fill:#FFD837;" points="241.371,240.152 204.8,256 126.171,256 0,256 128,126.781 "/>
<polygon style="fill:#F14336;" points="385.829,128 272.457,241.371 256.61,204.8 256.61,203.959 256.61,128.61 256.61,0 "/>
</svg>

<style type="text/css">
.chrome-icon1 {
 animation: haha 2s infinite;
 animation-timing-function:linear;
}

@keyframes haha{
0% { transform:rotate(0deg);}

100% { transform : rotate(-360deg)}
}  

.chrome-icon2 {
 animation: hahaha 2s infinite;
 animation-timing-function:linear;
}

@keyframes hahaha{
0% { transform:rotate(0deg);}

100% { transform : rotate(360deg)}
}  
</style>
</center>
</body>
</html>
